<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title th:text="${session.title}">123</title>
    <link th:replace="common/header"/>
    <link rel="stylesheet" th:href="@{/css/ace-skins.min.css}"/>
    <link rel="stylesheet" th:href="@{/js/iStu/lrtk.css}"/>
    <script type="text/javascript">
        $(function () {
            var txbmid = $("#id").val();
            $("#big_play_prev").click(function () {
                console.log(txbmid);
                $.ajax({
                    type: "POST",
                    url: "/foot/photo/find",
                    data: {"index": -1, "id": txbmid},
                    dataType: "json",
                    success: function (data) {
                        if (txbmid === data.id) {
                            return;
                        }
                        txbmid = data.id;
                        if (data.name) {
                            $("#name").text(data.name);
                        } else {
                            $("#name").text("");
                        }
                        if (data.dx) {
                            $("#dx").text(data.dx);
                        } else {
                            $("#dx").text("");
                        }
                        if (data.ext) {
                            $("#ext").text(data.ext);
                        } else {
                            $("#ext").text("");
                        }
                        $("#tpfl").text(data.type.text);
                        $("#pszp").attr("src", "/" + data.url);
                    }
                });
            });
            $("#big_play_next").click(function () {
                $.ajax({
                    type: "POST",
                    url: "/foot/photo/find",
                    data: {"index": 1, "id": txbmid},
                    dataType: "json",
                    success: function (data) {
                        if (txbmid === data.id) {
                            return;
                        }
                        txbmid = data.id;
                        if (data.name) {
                            $("#name").text(data.name);
                        } else {
                            $("#name").text("");
                        }
                        if (data.dx) {
                            $("#dx").text(data.dx);
                        } else {
                            $("#dx").text("");
                        }
                        if (data.ext) {
                            $("#ext").text(data.ext);
                        } else {
                            $("#ext").text("");
                        }
                        $("#tpfl").text(data.type.text);
                        $("#pszp").attr("src", "/" + data.url);
                    }
                });
            });

            $('.list_table tbody tr').addClass('odd');
            $('.list_table tbody tr:even').addClass('even'); //奇偶变色,添加样式
            var upTable = $("#up_downTable");
            upTable.addClass("hand");
            upTable.click(function () {
                var search = $("#search");
                search.toggle();
                if (search.attr("style") !== "width:100%;display: none;") {
                    $("#pszp").animate({height: "434px"});
                }
            });
        });
    </script>
</head>
<body class="navbar-fixed">
<div th:replace="common/top"></div>
<div class="container-fluid main_bg" id="main-container">
    <a id="menu-toggler" href="#"><span></span></a>
    <div th:replace="common/menu"></div>
    <div id="main-content" class="clearfix">
        <div id="page-content" class="clearfix">
            <div th:replace="common/title"></div>
            <h3 class="header smaller lighter blue"><em class="icon-eye-open"></em>查看图库记录</h3>
            <div th:if="${session.footUser.qx.text == '管理员'}">
                <input type="hidden" name="id" id="id" th:value="${photo.id}"/>
                <div class="row-fluid">
                    <div class="span12">
                        <button id="up_downTable" type="button" class="badge badge-success"><em
                                class="icon-circle-arrow-down"></em></button>
                    </div>
                </div>
                <div class="row-fluid">
                    <div class="span12">
                        <table id="search" style="display: none;width:100%;" border="0" class="list_table">
                            <tbody>
                            <tr>
                                <th style="width:150px">图片名称:</th>
                                <td id="name" th:text="${photo.name}">123</td>
                                <th style="width:150px">图片分类:</th>
                                <td id="tpfl" th:text="${photo.type.text}">123</td>
                            </tr>
                            <tr>
                                <th>图片大小:</th>
                                <td id="dx" th:text="${photo.dx}">123</td>
                                <th>图片类型:</th>
                                <td id="ext" th:text="${photo.ext}">123</td>
                            </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
                <div class="row-fluid">
                    <!--PAGE CONTENT BEGINS HERE-->
                    <div class="span12">
                        <div style="MARGIN: 0 auto; WIDTH: 100%; HEIGHT: 436px; OVERFLOW: hidden">
                            <div style="MARGIN: 0 auto; WIDTH: 100%; HEIGHT: 436px; OVERFLOW: hidden" id="bigpicarea">
                                <p class="bigbtnPrev"><span id="big_play_prev"></span></p>
                                <div id="image_xixi-01" class="image">
                                    <img alt="" id="pszp" th:src="@{'/' + ${photo.url}}" style="height:494px" src=""/>
                                    <p class="bigbtnNext"><span id="big_play_next"></span></p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="row-fluid">
                    <div class="text-center span12">
                        <a class="btn btn-primary" type="button" th:href="@{/foot/photo/edit(id=${photo.id})}"><em
                                class="icon-edit"></em>修改</a>
                        <a class="btn btn-danger" type="button"
                           th:onclick="'javascript:deleteById(\'/foot/photo/delete?id=\', ' + ${photo.id} + ')'"> <em
                                class="icon-remove"></em>删除 </a>
                        <a class="btn" type="button" th:href="@{/foot/photo/search}"><em class="icon-arrow-left"></em>返回</a>
                    </div>
                </div>
            </div>
            <!--/#page-content-->
        </div>
        <div th:replace="common/skin :: skin"></div>
    </div>
    <!--/#main-content-->
</div>
<!--/.fluid-container#main-container-->
<div th:replace="common/js"></div>
</body>
</html>